$tooltip-popover-color: #fff;
// drop-list-popover
$drop-list-popover-bgcolor: #262c33;
$drop-list-popover-bgcolor-hover: #1a1b1d;
$tooltip-popover-shadow-color: #000;

.drop-list-popover.el-popover {
	display: inline-block;
	position: absolute;
	box-sizing: border-box;
	color: $tooltip-popover-color;
	padding: 0;
	border: 0;

	.drop-list-wp {
		position: relative;
		background: $drop-list-popover-bgcolor;
		box-shadow: 0 1px 4px -3px $tooltip-popover-shadow-color;
		border-radius: 1px;

		.item-container {
			max-height: 240px;
			overflow-y: auto;
		}

		.drop-list-item {
			display: flex;
			align-items: center;
			text-decoration: none;
			font-size: 12px;
			height: 30px;
			line-height: 30px;
			padding-left: 10px;
			padding-right: 12px;
			text-overflow: ellipsis;
			overflow: hidden;
			white-space: nowrap;
			border-radius: 1px;
			color: $tooltip-popover-color;
			transition: 0.2s;
			border-left: 3px solid transparent;

			&:hover {
				border-left-color: var(--el-color-parimary);
				background: $drop-list-popover-bgcolor-hover;
			}

			&:not(:first-child) {
				border-top: 1px solid $drop-list-popover-bgcolor-hover;
			}
		}

		.drop-text {
			display: block;
			margin-left: 6px;

			&.--no-icon {
				margin-left: 0;
			}
		}
	}
}
